<template>
  <div>
    <div class="header">
            <mt-swipe :auto="0" :show-indicators="false">
                <mt-swipe-item class="header-img" v-for="(item,index1) in swipeList" :key="index1">
                    <img :src=item alt="">
                </mt-swipe-item>
            </mt-swipe>
        </div>

      <div class="container">
          <slide :slideList=slideList></slide>
          <div class="line-w"></div>
          <news :newsList=newsList style="margin-top: .25rem;"></news>
          <div class="banner">
              <img :src=bannerUrl />
          </div>
          <news :newsList=newsList style="margin-top: .2rem;"></news>
      </div> 
    <!-- </scroll> -->
    <home-footer :hover="currentItem"></home-footer>
  </div>
</template>
<script>
import {Swipe, SwipeItem} from "mint-ui";
import HomeFooter from '../../components/Footer'
import slide from "./components/slide"
import news from "../../components/news"
import Scroll from '../../components/scroll'
import {consultationIndex} from '@/request/api';
import { Toast,Indicator } from 'mint-ui'
export default {
  name: "consultation",
  components: {
    HomeFooter,
    mtSwipe:Swipe,
    mtSwipeItem:SwipeItem,
    slide,
    news,
    Scroll
  },
  data: function() {
    return {
      bannerUrl:'/static/imgs/banner.png',
      currentItem:'0',
      selected:'社区',
      selected2:'1',
      swipeList:['/static/img/deatilBg.png','/static/img/deatilBg.png','/static/img/deatilBg.png'],
      slideList:[{title:'欧冠1/8决赛',img1:'/static/imgs/faxian.png',img2:'/static/imgs/faxian.png',time:'04:00',name1:'曼城',name2:'尤文图斯',grade1:'7',grade2:'7'},
        {title:'欧冠1/4决赛',img1:'/static/imgs/faxian.png',img2:'/static/imgs/faxian.png',time:'04:00',name1:'沙尔克',name2:'马德里竞技',grade1:'7',grade2:'7'},
        {title:'欧冠1/8决赛',img1:'/static/imgs/faxian.png',img2:'/static/imgs/faxian.png',time:'04:00',name1:'曼城',name2:'尤文图斯',grade1:'7',grade2:'7'},
        {title:'欧冠1/8决赛',img1:'/static/imgs/faxian.png',img2:'/static/imgs/faxian.png',time:'04:00',name1:'测试多文字显示效果',name2:'尤文',grade1:'7',grade2:'7'},
      ],
      newsList:[
        {time:'十分钟前',imgUrl:'/static/img/header.png',
        title:'今天天气真好，国际米兰又想要赢球，但是没什么机会啊，',
        
        },
        {time:'十分钟前',imgUrl:'/static/img/header.png',
        title:'今天天气真好，国际米兰又想要赢球，但是没什么机会啊，',
        },
        {time:'十分钟前',imgUrl:'/static/img/header.png',
        title:'今天天气真好，国际米兰又想要赢球，但是没什么机会啊，得加油，努努力多赢点球好吃饭去，内容不限制字数，但是最多显示三行，多少字符开发定今天天气真好，国际米兰又想要赢球，但是没什么机会啊，得加油，努努力多赢点球好吃饭去，内容不限制字数，但是最多显示三行，多少字符开发定',
        }
      ]
    };
  },
  methods: {
    choose(e){
      this.selected=e;
    },
    search(){
      console.log(1)
    },
    getNewsList(){ 
			Indicator.open({
			  text: '加载中···',
			  spinnerType: 'fading-circle'
			});
      var t = this
	    consultationIndex({"pageNo":1}).then(function(res) {
        // res = res.data
        console.log(res)
        Indicator.close();
	     })
      .catch(function (error) {
	       Toast(error);
      });
		},
    
  },

  created(){

  },
  mounted(){
    this.getNewsList()
  }
    

};
</script>
<style lang="less" scoped>
@import '~styles/header.less';
img{
  width: 100%;
  height: 100%;
}
.line-h{
    width: 100%;
    height: .11rem;
    background: #F5F8FB;
}
.line-w{
    width: 100%;
    height: .11rem;
    background: #F5F8FB;
}
.header{
    width: 100%;
    height: 4.2rem;
    position: fixed;
    top:0;
    left: 0;

}
.container{
    position: relative;
    margin-bottom: 1.33rem;
    margin-top: 4.2rem;
    width: 100%;
    .banner{
        padding: .2rem;
        border-radius: .12rem;
        overflow: hidden;
    }
}

</style>